<template>
	<view class="page page-pickupsale">
		<view p10px>
			<view pt14px pb14px border-b relative>
				<view pb10px>询价描述</view>
				<textarea :maxlength="200" v-model="desc" p-10px bg-gray-1 w-full rounded placeholder="询价描述"/>
				<view absolute bottom-20px right-10px>{{ desc.length }} / 200</view>
			</view>

			<view flex items-center justify-between mt10px pb-10px border-b>
				<view> <text color-red-5>*</text> 联系人</view>
				<uni-easyinput color-gray v-model="contact" :inputBorder="false" placeholder="请输入联系人 &nbsp;"></uni-easyinput>
			</view>

			<view flex items-center justify-between mt10px pb-10px border-b>
				<view> <text color-red-5>*</text> 联系电话</view>
				<uni-easyinput color-gray v-model="phone" :inputBorder="false" placeholder="请输入联系电话 &nbsp;"></uni-easyinput>
			</view>

			<view flex items-center justify-between mt10px pb-10px border-b>
				<view>企业名称</view>
				<uni-easyinput color-gray v-model="enterprise" :inputBorder="false" placeholder="请输入企业名称 &nbsp;"></uni-easyinput>
			</view>
			
			<view fixed w-94vw bottom-20px left-3vw>
				<button w-full type="primary" rounded-100px :loading="loading" @click="submit">提交</button>
			</view>
		</view>
	
	</view>

</template>

<script setup>
	import api from '@/api'
	import { reactive, ref, computed } from 'vue'

	const {id} = defineProps({
		id: String
	})
	const enterprise = ref('')
	const contact = ref('')
	const phone = ref('')
	const desc = ref('')


	const submit = async () => {
		if(!desc.value) {
			uni.showToast({ title: '请填写询价描述', icon: 'none' })
			return
		}
		if(!contact.value) {
			uni.showToast({ title: '联系人不能为空', icon: 'none' })
			return
		}
		if(!phone.value) {
			uni.showToast({ title: '电话不能为空', icon: 'none' })
			return
		}

		const submitRes = await api.askPrice({
			goods_id: id,
			description: desc.value,
			company_name: enterprise.value,
			contact_name: contact.value,
			contact_phone: phone.value,
		})
		if(submitRes) {
			uni.showToast({ 
				title: '提交成功', 
				icon: 'none',
				success: () => {
					const timer = setTimeout(() => {
						uni.navigateBack()
						clearTimeout(timer)
					}, 2000);
				}
			})
		}
	}
	
</script>

<style lang="scss">
.page-pickupsale {
	
	.border-b{
		border-bottom: 1px solid #eee;
	}
	.uni-easyinput  {
		text-align: right;
	}
	.input-value-border {
		border: none;
	}
}



</style>
